import "./newTab.scss";
//
import { createApp } from "vue";
import svgIconMenu from "@/components/SvgIconMenu/SvgIconMenu";
import newTabCard from "@/components/NewTabCard/NewTabCard";
import bodyMenu from "@/components/BodyMenu/BodyMenu";
import {appDB} from "../../appCls/Database/AppDB";
import {BodyMenu} from "../../components/BodyMenu/BodyMenu";

const appNewTab = createApp({
    components: {
        svgIconMenu,
        newTabCard,
        bodyMenu,
    },
    data() {
      return {
          cardSearchText: "",
          cardList: [],
          isShowPopAddCard: false,
      };
    },
    created() {
        this.getCardList();
    },
    methods: {
        onChangeCardSearchText(text: string) {
            console.log("filter string:", text);
        },
        getCardList() {
            appDB.getDataBase().then((db) => {
                return appDB.tableCardList!.getList().then((item) => {
                    console.log(item);
                });
            }).catch((err) => {
                console.error(err);
            });
        },
        onContextMenuBody(evt: MouseEvent) {
            evt.preventDefault();
            this.$refs.menu.openMenu(evt);
        },
        onMenuAction(actionItem: BodyMenu.MenuItem) {
            switch(actionItem.action) {
                case "addCard":
                    this.showPopAddCard();
                    break;
            }
        },
        showPopAddCard() {

        },
    },
});

appNewTab.mount("#app");
